<template>
  <div>
    <div style="margin-bottom:0.5rem">
      <van-nav-bar title="养护服务" left-arrow @click-left="onClickLeft" />
      <img
        src="https://img14.360buyimg.com/da/jfs/t1/34701/20/12830/57575/5d0c9df6E331d70ee/cb6f9c630b1ce127.jpg"
        class="img1"
      />
      <div>
        <van-tabs v-model="active" line-width="60">
          <van-tab title="包包养护">
            <div style="height:12rem;overflow:auto;">
              <van-card
                thumb-link="yanghu#/liaotian"
                v-for="item1 in list"
                :price="item1.platformPrice"
                :desc="item1.goodsDetail"
                :title="item1.goodsName"
                :thumb="item1.imageUrl"
              >
              <div slot="footer" style="margin-left:7.5rem">
                <van-button size="mini" @click="tab()">咨询</van-button>
              </div>  
              </van-card>
            </div>
          </van-tab>
          <van-tab title="鞋子养护">
          <div style="height:12rem;overflow:auto;">
              <van-card
                thumb-link="yanghu#/liaotian"
                v-for="item1 in list"
                :price="item1.platformPrice"
                :desc="item1.goodsDetail"
                :title="item1.goodsName"
                :thumb="item1.imageUrl"
              >
              <div slot="footer" style="margin-left:7.5rem">
                <van-button size="mini" @click="tab()">咨询</van-button>
              </div>  
              </van-card>
            </div>
          </van-tab>
          <van-tab title="手表养护">
          <div style="height:12rem;overflow:auto;">
              <van-card
                thumb-link="yanghu#/liaotian"
                v-for="item1 in list"
                :price="item1.platformPrice"
                :desc="item1.goodsDetail"
                :title="item1.goodsName"
                :thumb="item1.imageUrl"
              >
              <div slot="footer" style="margin-left:7.5rem">
                <van-button size="mini" @click="tab()">咨询</van-button>
              </div>  
              </van-card>
            </div>
          </van-tab>
          <van-tab title="首饰养护">
          <div style="height:12rem;overflow:auto;">
              <van-card
                thumb-link="yanghu#/liaotian"
                v-for="item1 in list"
                :price="item1.platformPrice"
                :desc="item1.goodsDetail"
                :title="item1.goodsName"
                :thumb="item1.imageUrl"
              >
              <div slot="footer" style="margin-left:7.5rem">
                <van-button size="mini" @click="tab()">咨询</van-button>
              </div>  
              </van-card>
            </div>
          </van-tab>
          <van-tab title="配饰养护">
            <div style="height:12rem;overflow:auto;">
              <van-card
                thumb-link="yanghu#/liaotian"
                v-for="item1 in list"
                :price="item1.platformPrice"
                :desc="item1.goodsDetail"
                :title="item1.goodsName"
                :thumb="item1.imageUrl"
              >
              <div slot="footer" style="margin-left:7.5rem">
                <van-button size="mini" @click="tab()">咨询</van-button>
              </div>  
              </van-card>
            </div>
          </van-tab>
        </van-tabs>
      </div>
    </div>
  </div>
</template>
<script>
import axios from "axios";
export default {
  data() {
    return {
      active: 0,
      list: []
    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    tab() {
      this.$router.push("/liaotian2");
    },
    // tap6(id) {
    //   this.$router.push("/details/" + id);
    // }
  },
  mounted() {
    // var _this = this;
    // axios({
    //   url: "http://10.8.157.39:8080/secluxury/goods/brandlist",
    // }).then(data => {
    //   console.log(data);
    //   this.list = data.data;
    // });
    axios({
      // url: "http://10.8.157.39:8080/secluxury/type/brandGoodsList "
      url: "http://47.102.221.184:8083/secluxury/type/brandGoodsList"
    })
      .then(data => {
        // console.log(data.data);
        var a = data.data;
        a.map(goods => {
          // console.log(goods.goodsList);
          goods.goodsList.map(yahu => {
            this.list.push(yahu);
            // console.log(yahu);
            // console.log(this.list);
          });
        });
      })
      .catch(err => {
        // console.log(err);
      });
  }
};
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
}
.img1 {
  width: 100%;
  height: 3rem;
}
</style>
